<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>简单个人页面</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
    <link rel="stylesheet" href="/css/reset.css">
    <script src="/js/plugins/jquery/jquery.min.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>

    <style>
        .simplePerson {
            text-align: center;
            color: #7A786F;
            padding-top: 50px;
            padding-bottom: 110px;
            background-color: #E8E6E8;
        }

        .mymenu {
            margin: 15px auto;
        }

        .mymenu i {
            margin-right: 20px;
        }

    </style>

    <script>

        $(function () {
            /*var data = {name:"admin"};
            $("#test").renderValues(data);*/


            //sessionStorage.getItem("user")
            //获取用户信息之后,需要转为json对象
            var user = JSON.parse(sessionStorage.getItem("user"))
            //把用户信息渲染到页面上
            $(".simplePerson").renderValues(user)

            //注销按钮
            $("#logout").click(function () {
                $.ajax({
                    url:'/sessions',
                    method:'DELETE',
                    success:function (data) {
                        if(data.success){
                            /*成功后,跳转指定页面*/
                            /*加parent,是让父窗口跳转,如果没有父窗口,还是它自己跳转*/
                            window.parent.location.href = "/login.html";
                        }
                    }
                })
            })

            //给a链接绑定事件
            $("a[data-url]").click(function () {
                //获取a链接的url值
                window.parent.location.href = $(this).data("url")
            })

        })
    </script>



</head>


<body>
<!--<div id="test">

    <span render-html="name">

    </span>

</div>-->

<div class="simplePerson">
    <img  class="rounded-circle" width="20%" render-src="headImgUrl">
    <p><strong render-html="nickName"></strong></p>
    <p render-html="email"></p>
    <hr>
    <div class="mymenu">
        <i class="fa fa-user fa-2x fa-fw"></i>
        <a href="javascript:;" data-url="/mine/profiles.html">
            我的</a>
    </div>
    <div class="mymenu">
        <i class="fa fa-bell fa-2x fa-fw"></i>
        <a href="javascript:;">信息</a>
    </div>
    <div class="mymenu">
        <i class="fa fa-comment fa-2x fa-fw"></i>
        <a href="javascript:;">通知</a>
    </div>
    <div class="mymenu">
        <i class="fa fa-cog fa-2x fa-fw"></i>
        <a href="javascript:;" data-url="/mine/info.html">设置</a>
    </div>
    <hr style="margin-top: 50px;">
    <div class="mymenu">
        <i class="fa fa-sign-out fa-2x fa-fw"></i>
        <label id="logout">退出登录</label>
    </div>
</div>



</body>

</html>